<template>
	<div class="exam_record_container">
		<div class="list">
			<template v-if="tableListData.length > 0">
				<exam-record v-for="(item, index) in tableListData" :key="index" :data="item">
					<el-button size="small" type="success" @click="handleLookReport(item)">查看成绩单</el-button>
					<el-button size="small" type="warning" v-if="!item.isExamPass" @click="handleAfreshExam(item)">重新考试</el-button>
				</exam-record>
			</template>
			<el-empty v-else :image-size="150" description="暂无数据"></el-empty>
		</div>
		<div class="page" v-if="dataCount > 0">
			<sw-pagination v-bind="pageLayout" :total="dataCount" :page.sync="queryData.page" :limit.sync="queryData.limit" @change="queryTableData()"></sw-pagination>
		</div>
		<exam-report v-model="reportDialog" :result-id="examResultId"></exam-report>
	</div>
</template>

<script>
import moment from 'moment';
import examRecord from './item';
import { mapGetters } from 'vuex';
import listMixins from '@/mixins/listMixins';
import examReport from '@/views/common/reportCard';
import { queryExamHisList } from '@/api/exam/testExamHis';
export default {
	mixins: [listMixins],
	components: { examRecord, examReport },
	data() {
		return {
			reportDialog: false,
			examResultId: ''
		};
	},
	computed: {
		...mapGetters(['userInfo']),
		userId() {
			return this.userInfo.id;
		},
		listFunction() {
			return eval(queryExamHisList);
		},
		requestParams() {
			return { ...this.queryData, createBy: this.userId };
		},
		pageLayout() {
			if (this.isMobile) {
				return { isSizes: false, isJumper: false, layout: 'prev, pager, next' };
			} else {
				return { isSizes: true, isJumper: true, layout: '' };
			}
		},
		tableListData() {
			return this.tableData.map((item) => {
				let score = parseFloat(item.score || '0');
				let passScore = parseFloat(item.testExam.passScore || '0');
				return { ...item, isExamPass: score >= passScore };
			});
		}
	},
	methods: {
		//查看成绩单
		handleLookReport(data) {
			this.reportDialog = true;
			this.examResultId = data.id;
		},

		//重新考试
		handleAfreshExam(data) {
			this.$bus.$emit('examConfirm', data.testExamId);
		}
	}
};
</script>

<style lang="scss" scoped>
.exam_record_container .page {
	padding: 16px;
}
</style>
